<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta content="" name="description"/>
    <meta content="webthemez" name="author"/>
    <title>文章主题</title>
    <!-- Bootstrap Styles-->
    <link href="assets/css/bootstrap.css" rel="stylesheet"/>
    <!-- FontAwesome Styles-->
    <link href="assets/css/font-awesome.css" rel="stylesheet"/>
    <!-- Morris Chart Styles-->

    <!-- Custom Styles-->
    <link href="assets/css/custom-styles.css" rel="stylesheet"/>
    <!-- Google Fonts-->
    <link href='http://fonts.useso.com/css?family=Open+Sans' rel='stylesheet' type='text/css'/>
    <!-- TABLE STYLES-->
    <link href="assets/js/dataTables/dataTables.bootstrap.css" rel="stylesheet"/>

    <link href="assets/css/base.css" rel="stylesheet"/>
    <link href="assets/css/article_details.css" rel="stylesheet"/>


    <!-- JS Scripts-->
    <!-- jQuery Js -->
    <script src="assets/js/jquery-1.10.2.js"></script>


    <!-- Bootstrap Js -->
    <script src="assets/js/bootstrap.min.js"></script>
    <!-- Metis Menu Js -->
    <script src="assets/js/jquery.metisMenu.js"></script>
    <!-- DATA TABLE SCRIPTS -->
    <!--<script src="assets/js/dataTables/jquery.dataTables.js"></script>-->
    <!--<script src="assets/js/dataTables/dataTables.bootstrap.js"></script>-->
    <!-- Custom Js -->
    <script src="assets/js/custom-scripts.js"></script>
    <!-- layer Js -->
    <script src="assets/js/layer.js"></script>
    <!-- base Js -->
    <script src="assets/js/base.js"></script>


</head>
<body>
<div id="wrapper">
    <nav class="navbar navbar-default top-navbar" role="navigation">
        <div class="navbar-header">
            <a class="navbar-brand" href="user.html"><strong><i class="icon fa fa-motorcycle"></i> 摩托之旅</strong></a>
            <div id="sideNav">
                <i class="fa fa-bars icon"></i>
            </div>
        </div>
        <ul class="nav navbar-top-links navbar-right">
            <!-- /.dropdown -->
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#" aria-expanded="false">
                    <i class="fa fa-user fa-fw"></i> <i class="fa fa-caret-down"></i>
                </a>
                <ul class="dropdown-menu dropdown-user">
                    <li><a href="change_password.html"><i class="fa fa-user fa-fw"></i> 修改密码</a></li>
                    <li id="log_off"><a href="#"><i class="fa fa-sign-out fa-fw"></i> 退出登录</a></li>
                </ul>
                <!-- /.dropdown-user -->
            </li>
            <!-- /.dropdown -->
        </ul>
    </nav>
    <!--/. NAV TOP  -->
    <nav class="navbar-default navbar-side" role="navigation">
        <div class="sidebar-collapse">
            <ul class="nav" id="main-menu">
                <li>
                    <a href="user.html"><i class="fa fa-user"></i>用户信息列表</a>
                </li>

                <li>
                    <a href="#">
                        <i class="fa fa-pie-chart"></i>摩托类型
                        <span class="fa arrow"></span>
                    </a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a href="motorcycle_list.html">摩托类型</a>
                        </li>
                        <li>
                            <a href="motorcycle_add.html">增加摩托类型</a>
                        </li>
                    </ul>
                </li>
                <li>
                    <a class="active-menu" href="#">
                        <i class="fa fa-book"></i>文章主题
                        <span class="fa arrow"></span>
                    </a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a href="articles_list.html">文章主题</a>
                        </li>
                        <li>
                            <a href="articles_add.html">增加文章主题</a>
                        </li>
                        <li>
                            <a href="articles.html">文章列表展示 </a>
                        </li>
                    </ul>
                </li>
                <li>
                    <a href="feedbacks.html"><i class="fa fa-file-text"></i>反馈</a>
                </li>

                <li>
                    <a href="gift.html"><i class="fa fa-gift"></i>礼物</a>
                </li>
                <li>
                    <a href="#">
                        <i class="fa fa-cogs"></i>商品管理
                        <span class="fa arrow"></span>
                    </a>
                    <ul class="nav nav-second-level">
                        <li>
                            <a href="good_list.html">商品列表展示</a>
                        </li>
                        <li>
                            <a href="good_add.html">商品上架</a>
                        </li>
                    </ul>
                </li>
                <li>
                    <a href="exchange.html"><i class="fa fa-exchange"></i>兑换信息</a>
                </li>
                <li>
                    <a href="systemMessage.html"><i class="fa fa-comments"></i>群发系统消息</a>
                </li>
                <li>
                    <a href="carouselFigure.html"><i class="fa fa-picture-o"></i>轮播图</a>
                </li>

                <li>
                    <a href="recharge.html"><i class="fa fa-usd"></i>充值</a>
                </li>
            </ul>

        </div>

    </nav>
    <!-- /. NAV SIDE  -->
    <div id="page-wrapper">
        <div class="header">
            <h1 class="page-header">
                文章主题
                <small>摩托之旅后台管理</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="articles_list.html">文章主题</a></li>
                <li><a href="articles.html">文章列表展示</a></li>
                <li><a href="articles.html">文章详情展示</a></li>
            </ol>

        </div>
        <div id="page-inner">
            <div class="row">
                <div class="col-md-12">
                    <!-- Advanced Tables -->
                    <div class="panel panel-default">
                        <div class="panel-body">
                            <div class="table-responsive">

                            </div>
                        </div>
                    </div>
                    <!--End Advanced Tables -->
                </div>
            </div>
            <!-- /. ROW  -->


        </div>
    </div>
    <!-- /. PAGE INNER  -->
</div>
<div class="loading">
    <img src="assets/img/loading.gif">
</div>

<!-- /. PAGE WRAPPER  -->
<!-- /. WRAPPER  -->


<script>
    if (storage_admin_id) {
        $("#sideNav").click(function () {
            if ($(this).hasClass('closed')) {
                $('.navbar-side').animate({left: '0px'});
                $(this).removeClass('closed');
                $('#page-wrapper').animate({'margin-left': '260px'});

            }
            else {
                $(this).addClass('closed');
                $('.navbar-side').animate({left: '-260px'});
                $('#page-wrapper').animate({'margin-left': '0px'});
            }
        });

        _article_info_all = location.search; //获取url中"?"符后的字串
        if (_article_info_all != '') {
            var _article_id = _article_info_all.substring(12, _article_info_all.length);
        }
        _article_details();
        $('.loading').hide();
    } else {
        window.location.href = "login.html"
    }

    function _article_details() {
        $.ajax({
            type: "GET",
            url: "http://118.178.59.93:8080/Motocycle/api/v1/articles/" + _article_id,
            async: false,
            success: function (data) {
                try {
                    var obj = JSON.parse(data);
                    var article_details_info = "";
                    if (obj.code == 0) {
                        article_details_info += "<p style='font-size: 20px;padding: 0;'>文章信息</p>" +
                                "<table class='table table-striped table-bordered table-hover'  id='dataTables-example'' style='text-align: center;'>" +
                                "<thead>" +
                                "<tr>" +
                                "<th>文章ID</th>" +
                                "<th>标题</th>" +
                                "<th>作者</th>" +
                                "<th>文章类型</th>" +
                                "</tr>" +
                                "</thead>" +
                                "<tbody>" +
                                "<tr>" +
                                "<td>" + obj.data.article_id + "</td>" +
                                "<td>" + obj.data.title + "</td>" +
                                "<td>" + obj.data.user.nickname + "</td>";
                        if (obj.data.type == 0) {
                            article_details_info += "<td>原创</td>"
                        } else {
                            article_details_info += "<td>转载</td>"
                        }
                        article_details_info += "</tr>" +
                                "</tbody>" +
                                "<thead>" +
                                "<tr>" +
                                "<th>创建时间</th>" +
                                "<th>更新时间</th>" +
                                "<th>用户删除</th>" +
                                "<th>管理员删除</th>" +
                                "</tr>" +
                                "</thead>" +
                                "<tbody>" +
                                "<tr>" +
                                "<td>" + obj.data.createdDate.substring(0, 11) + "</td>" +
                                "<td>" + obj.data.updatedDate.substring(0, 11) + "</td>";
                        if (obj.data.del_flag == 1) {
                            article_details_info += "<td>是</td>"
                        } else {
                            article_details_info += "<td></td>"
                        }
                        if (obj.data.admin_del == 1) {
                            article_details_info += "<td>是</td>"
                        } else {
                            article_details_info += "<td></td>"
                        }
                        article_details_info += "</tr>" +
                                "</tbody>" +
                                "<thead>" +
                                "<tr>" +
                                "<th>主题名</th>" +
                                "<th>摩托车型</th>" +
                                "<th>精品</th>" +
                                "<th>点击数</th>" +
                                "</tr>" +
                                "</thead>" +
                                "<tbody>" +
                                "<tr>";
                        if (obj.data.theme_name) {
                            article_details_info += "<td>" + obj.data.theme_name + "</td>"
                        } else {
                            article_details_info += "<td></td>"
                        }
                        article_details_info += "<td>" + obj.data.mototype_name + "</td>";
                        if (obj.data.is_nice == 1) {
                            article_details_info += "<td>是</td>"
                        } else {
                            article_details_info += "<td></td>"
                        }
                        article_details_info += "<td>" + obj.data.see_count + "</td>" +
                                "</tr>" +
                                "</tbody>" +
                                "<thead>" +
                                "<tr>" +
                                "<th>评论数</th>" +
                                "<th>送礼数</th>" +
                                "<th>点赞数</th>" +
                                "<th>收藏数</th>" +
                                "</tr>" +
                                "</thead>" +
                                "<tbody>" +
                                "<tr>" +
                                "<td>" + obj.data.comment_count + "</td>" +
                                "<td>" + obj.data.gift_count + "</td>" +
                                "<td>" + obj.data.like_count + "</td>" +
                                "<td>" + obj.data.save_count + "</td>" +
                                "</tr>" +
                                "</tbody>" +
                                "</table>" +
                                "<p style='font-size: 20px;padding: 0;'>文章内容展示";
                        if (obj.data.del_flag == 1 || obj.data.admin_del == 1) {
                            article_details_info += "(已删除)"
                        }
                        article_details_info += "</p>" +
                                "<div>" +
                                "<h2>" + obj.data.title + "</h2>";
                        var _content = obj.data.content.split("$$##MotorTravel##$$");
                        for (var i = 0; i < _content.length; i++) {
                            var n = _content[i].substring(0, 12);
                            var m = _content[i].substring(0, 13);
                            if (n == "$$##Text##$$") {
                                //纯文字
                                article_details_info += "<p class='thread-model-txt'>" + _content[i].substring(12, _content[i].length) + "</p>"
                            } else if (m == "$$##Image##$$") {
                                //图
                                var _content_image_description = _content[i].split("$$##ImageDescription##$$");
                                var _content_image_url = _content_image_description[0].split("$$##ImageInfo##$$");
                                article_details_info += "<div class='thread-model'><div class='img-box' style='width: 100%'>";
                                for (var a = 0; a < _content_image_description.length; a++) {
                                    if (a == 0) {
                                        article_details_info += "<a href=" + _content_image_url[a].substring(13, _content_image_description[0].length) + " style='display:inline-block' target='_blank'>" +
                                                "<img src=" + _content_image_url[a].substring(13, _content_image_description[0].length) + " class='upload image_show' style='display: inline-block;width: 100%;'>" +
                                                "<div style='margin-top: -15px;'>" +
                                                "<img src='assets/img/logowater.png' style='width: 20%;height: auto;min-width: 90px;'>" +
                                                "</div>" +
                                                "</a></div>"
                                    } else if (a == 1) {
                                        article_details_info += "<div class='description'><p>" + _content_image_description[a] + "</p></div>"
                                    }
                                }
                                article_details_info += "</div>"
                            } else if (m == "$$##Video##$$") {
                                //视频
                                var _content_video_description = _content[i].split("$$##VideoDescription##$$");
                                article_details_info += "<div class='thread-model'><div class='img-box' style='width: 100%'>";
                                for (var b = 0; b < _content_video_description.length; b++) {
                                    if (b == 0) {
                                        article_details_info += "<a href=" + _content_video_description[b].substring(13, _content_video_description[b].length) + " style='display:inline-block' target='_blank'>" +
                                                "<video src=" + _content_video_description[b].substring(13, _content_video_description[b].length) + " class='upload' style='display: inline-block;width: 100%;' controls='controls'>" +
                                                "</a>" +
                                                "</div>"
                                    } else if (b == 1) {
                                        article_details_info += "<div class='description'><p>" + _content_video_description[b] + "</p></div>"
                                    }
                                }
                                article_details_info += "</div>"
                            }
                        }
                        article_details_info += "</div>" +
                                "</div>";
                        $('.table-responsive').html(article_details_info)
                    }
                } catch (e) {
                    layer.msg("出错啦!待会儿再来试试看吧~~~")
                }
            }
        })
    }
</script>

</body>
</html>
